﻿@page "/project/team"
@inject GitHubApiClient _gitHubApiClient;

<DocsPage>
    <MudContainer>
        <MudText Typo="Typo.h3" GutterBottom="true">Meet the team</MudText>
        <MudText Typo="Typo.h6" Style="font-weight: 400; line-height: 1.2;">
            MudBlazor is not a one-person show. A nice little community has emerged and a couple of highly motivated people are working on improvements and are regularly adding more components.
            Everyone is welcome to join in and contribute to make this library even more awesome than it already is.
        </MudText>

        <MudText Typo="Typo.h4" GutterBottom="true" Color="Color.Primary">Core Team</MudText>
        <MudText Class="mb-8">The Core Team who guide, develop and direct the development of MudBlazor.</MudText>
        <MudGrid>
            <MudItem xs="12" md="6">
                <MudCard Elevation="4">
                    <MudCardHeader>
                        <CardHeaderAvatar>
                            <MudAvatar Image="https://avatars.githubusercontent.com/u/10367109?v=4" Size="Size.Large" Class="mud-elevation-4" />
                        </CardHeaderAvatar>
                        <CardHeaderContent>
                            <MudText Typo="Typo.body1">Jonny Larsson</MudText>
                            <MudText Typo="Typo.body2">Creator</MudText>
                        </CardHeaderContent>
                        <CardHeaderActions>
                            <MudIconButton Icon="@Icons.Custom.Brands.GitHub" Link="https://github.com/Garderoben" Color="Color.Surface" />
                            <MudIconButton Icon="@Icons.Custom.Brands.LinkedIn" Link="https://www.linkedin.com/in/jonny-larsson-b72480161/" Target="_blank" Color="Color.Primary" />
                        </CardHeaderActions>
                    </MudCardHeader>
                    <MudCardContent>
                        <MudList>
                            <MudListItem Icon="@Icons.Material.Filled.Place" Text="Örebro, Sweden" />
                            <MudListItem Icon="@Icons.Material.Filled.Translate" Text="Swedish, English" />
                        </MudList>
                    </MudCardContent>
                </MudCard>
            </MudItem>
            <MudItem xs="12" md="6">
                <MudCard Elevation="4">
                    <MudCardHeader>
                        <CardHeaderAvatar>
                            <MudAvatar Image="https://avatars.githubusercontent.com/u/44090?v=4" Size="Size.Large" Class="mud-elevation-4" />
                        </CardHeaderAvatar>
                        <CardHeaderContent>
                            <MudText Typo="Typo.body1">Meinrad Recheis</MudText>
                            <MudText Typo="Typo.body2">Co-Creator</MudText>
                        </CardHeaderContent>
                        <CardHeaderActions>
                            <MudIconButton Icon="@Icons.Custom.Brands.GitHub" Link="https://github.com/henon" Color="Color.Surface" Target="_blank" />
                            <MudIconButton Icon="@Icons.Custom.Brands.LinkedIn" Link="https://www.linkedin.com/in/meinrad-recheis-6a9885171/" Target="_blank" Color="Color.Primary" />
                        </CardHeaderActions>
                    </MudCardHeader>
                    <MudCardContent>
                        <MudList>
                            <MudListItem Icon="@Icons.Material.Filled.Place" Text="Vienna, Austria" />
                            <MudListItem Icon="@Icons.Material.Filled.Translate" Text="German, English, Chinese" />
                        </MudList>
                    </MudCardContent>
                </MudCard>
            </MudItem>
        </MudGrid>

        <MudText Typo="Typo.h4" GutterBottom="true" Color="Color.Secondary">Contribution Team</MudText>
        <MudText Class="mb-8">Core Contributors who work closly with the Core Team and are actively working on MudBlazor.</MudText>

        <MudGrid>
            @foreach (var contri in _contributors)
            {
                <MudItem xs="12" md="6">
                    <MudCard Elevation="4">
                        <MudCardHeader>
                            <CardHeaderAvatar>
                                <MudAvatar Image="@contri.Avatar" Size="Size.Large" Class="mud-elevation-4" />
                            </CardHeaderAvatar>
                            <CardHeaderContent>
                                <MudText Typo="Typo.body1">@contri.Name</MudText>
                                <MudText Typo="Typo.body2">@contri.Github</MudText>
                            </CardHeaderContent>
                            <CardHeaderActions>
                                <MudIconButton Icon="@Icons.Custom.Brands.GitHub" Link="@("https://github.com/"+contri.Github)" Color="Color.Surface" Target="_blank" />
                                @if(contri.LinkedIn != null)
                                {
                                    <MudIconButton Icon="@Icons.Custom.Brands.LinkedIn" Link="@contri.LinkedIn" Color="Color.Primary" Target="_blank" />
                                }
                            </CardHeaderActions>
                        </MudCardHeader>
                        <MudCardContent Class="py-0">
                            <MudList>
                                <MudListItem Icon="@Icons.Material.Filled.Place" Text="@contri.From" />
                            </MudList>
                        </MudCardContent>
                    </MudCard>
                </MudItem>
            }
        </MudGrid>

        <MudText Typo="Typo.h4" Class="mt-16 mb-8" GutterBottom="true">All contributors</MudText>
        <MudGrid>
            @if (_githubContributors == null)
            {
                <MudProgressCircular Color="Color.Primary" Indeterminate="true" />
            }
            else
            {
                @foreach (var contributor in _githubContributors.OrderByDescending(x => x.contributions))
                {
                    <MudItem xs="12" md="6">
                        <MudContributor Firstname="@contributor.login" AvatarLink="@contributor.avatar_url" GithubLink="@contributor.html_url" />
                    </MudItem>
                }
            }
        </MudGrid>
    </MudContainer>
    <MudContainer>
        <div class="my-16"></div>
    </MudContainer>
</DocsPage>
<Footer />

@code
{
    private GithubContributors[] _githubContributors;
    protected override async Task OnInitializedAsync()
    {
        _githubContributors = await _gitHubApiClient.GetContributorsAsync();
        StateHasChanged();
    }

    private Contributor[] _contributors = new Contributor[]
    {
        new Contributor { Name = "András Tangl", From = "Szombathely, Hungary", Github = "tungi52", Avatar = "https://avatars.githubusercontent.com/u/22996720?v=4", LinkedIn = "https://www.linkedin.com/in/andr%C3%A1s-tangl-683a20215/"},
        new Contributor { Name = "Henrique Clausing", From = "Minas Gerais, Brazil", Github = "HClausing", Avatar = "https://avatars.githubusercontent.com/u/15158923?v=4", LinkedIn = "https://www.linkedin.com/in/henrique-clausing-cunha-45085944/"},
        new Contributor { Name = "Mike Surcouf", From = "Jersey, Channel Islands", Github = "mikes-gh", Avatar = "https://avatars.githubusercontent.com/u/16208742?v=4", LinkedIn = null},
        new Contributor { Name = "Porkopek", From = "Fundão, Portugal", Github = "porkopek", Avatar = "https://avatars.githubusercontent.com/u/13745954?v=4", LinkedIn = null},
        new Contributor { Name = "Benjamin Kappel", From = "Mexico", Github = "just-the-benno", Avatar = "https://avatars.githubusercontent.com/u/51370361?v=4", LinkedIn = "https://www.linkedin.com/in/benjamin-kappel-558428168/"},
        new Contributor { Name = "Jonas B", From = "Germany", Github = "JonBunator", Avatar = "https://avatars.githubusercontent.com/u/62108893?v=4", LinkedIn = null}
    };

    internal class Contributor
    {
        public string Name;
        public string From;
        public string Github;
        public string Avatar;
        public string LinkedIn;
    }
}
